<!DOCTYPE html>
<html>
<head>
  <script src="../../../resources/testharness.js"></script>
  <script src="../../../resources/testharnessreport.js"></script>
  <script src="../resources/picker-common.js"></script>
  <script src="../calendar-picker/resources/calendar-picker-common.js"></script>
</head>

<body>
<input type="week" id="week1" value="2000-W13">

<script>
promise_test(() => {
  let week1 = document.getElementById('week1');
  return openPickerWithPromise(week1).then(() => {
    let markDirtyCounter = 0;
    let focusCounter = 0;

    let promise = new Promise((resolve, reject) => {
      accessibilityController.setNotificationListener(function(axnode, type) {
        if (type == 'Focus') {
          console.log('Focused: ' + accessibilityController.focusedElement.name.replace(/,/g, ''));
          focusCounter++;
        } else if (type == 'MarkDirty') {
          console.log('Received MarkDirty');
          markDirtyCounter++;
        }

        if (focusCounter == 1 && markDirtyCounter >= 3) {
          resolve();
        }
      });

      // In case of failure, reject the promise so we get some logs instead of timing out.
      window.setTimeout(() => {
        reject(`Didn't receive expected events.  Got ${focusCounter} Focus and ${markDirtyCounter} MarkDirty`);
      }, 1500);
    });

    eventSender.keyDown('ArrowDown');
    return promise;
  });
}, 'Tests if typing an arrow key dispatches |Focus| and |MarkDirty| a11y events.');

</script>
</body>
</html>
